<!DOCTYPE html>
<html>
<head>
    <% include ../common/meta.ejs %>
    <% include ../common/public.ejs %>
    <style>
        .input-group-addon {
            padding: 5px 12px;
        }
    </style>
</head>
<body>
<% include ../common/header.ejs %>
<div class="container">
    <div class="dolphin-row main page-content">
        <div class="page-header">
            <h5 class="content-title">券管理</h5>
            <input id="publicContextPath" type="hidden" value="<%= global.config.contextPath%>" />
            <div class="pull-left">
                <ul class="fl">
                    <li>
                        <button class="btn btn-block btn-info newData"><i class="fui-plus-circle icon-menu"></i>
                            <span>新建券模型</span>
                        </button>
                    </li>
                </ul>
            </div>
        </div>

        <div class="dolphin-col-24">
            <div class="row">
                <div class="col-md-6">
                    <div class="queryCondition">
                        <form class="query-form">
                            <div class="row">
                                <div class="col-md-4">
                                    <label>券名称：</label>
                                    <input type="text" placeholder="名称模糊查询" name="name_like" style="width: 100px;">
                                </div>
                                <!--<div class="col-md-8">
                                    <label>有效时间 ：</label>
                                    <input type="text" class="width3" name="_startDate" placeholder="yyyy-MM-dd">
                                    ~
                                    <input type="text" class="width3" name="_endDate" placeholder="yyyy-MM-dd">
                                </div>-->
                                <div class="col-md-8" style="margin-top: 3px">
                                    <label class="col-md-offset-1 col-md-2 " style="width: 100px;margin-left: -20px">有效时间 :</label>
                                    <div class="col-md-3">
                                        <div class="input-group date dolphin_date_picker" style="margin-left: -20px">
                                            <input class="width3" type="text" name="_startDate" placeholder="yyyy-MM-dd" style="width: 100px">
                                            <span class="input-group-addon" style="padding: 0px 10px">
                                                <i class="glyphicon glyphicon-th"></i>
                                            </span>
                                        </div>
                                    </div>
                                    <div class="col-md-1" style="text-align: center;margin-left: 27px">
                                        ~
                                    </div>
                                    <div class="col-md-3" style="margin-left: -20px">
                                        <div class="input-group date dolphin_date_picker">
                                            <input class="width3" type="text" name="_endDate" placeholder="yyyy-MM-dd" style="width: 100px">
                                            <span class="input-group-addon" style="padding: 0px 10px">
                                                <i class="glyphicon glyphicon-th"></i>
                                            </span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-2">
                                    <button class="btn btn-sm btn-inverse btn-query" type="button">搜索</button>
                                </div>
                            </div>
                        </form>
                    </div>

                    <div id="dataList" class="box-content"></div>
                </div>
                <div class="col-md-6">
                    <div id="couponList"></div>
                </div>
                <form class="dilivery-form">
                    <input type="hidden" id="userId" name="userId" />
                    <input type="hidden" id="couponId" name="couponId" />
                </form>
            </div>
        </div>



    </div>
</div>

<!--券模型的模态框 start-->
<div class="modal fade" id="dataModal" tabindex="-1" role="dialog" aria-labelledby="dataModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="dataModalLabel">券模型维护</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal edit-form">
                    <input type="hidden" class="form-control" name="id">
                    <div class="form-group">
                        <label class="col-md-3 control-label">券名称</label>
                        <div class="col-md-6">
                            <input class="form-control" name="name" type="text" dol-validate="required">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-3 control-label">券编码</label>
                        <div class="col-md-6">
                            <input class="form-control" name="code" type="text" dol-validate="required">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-3 control-label">券类型</label>
                        <div class="col-md-6">
                            <select class="form-control" options="couponType" id="couponType"
                                    codeField="code" nameField="name" name="couponType" dol-validate="required"></select>
                        </div>
                    </div>
                    <div class="form-group" style="display: none" id="couponValDiv">
                        <label class="col-md-3 control-label" id="couponValLabel"></label>
                        <div class="col-md-6">
                            <div class="input-group">
                                <input id="couponVal"  class="form-control" name="couponVal" type="text" dol-validate="required">
                                <span class="input-group-addon" id="couponValUnit"></span>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-3 control-label">有效期开始</label>
                        <div class="col-md-6">
                            <div class="input-group date dolphin_date_picker" pickerPosition="bottom-left">
                                <input class="form-control" type="text" name="startDate" id="startDateInput">
                                <span class="input-group-addon">
                                    <i class="glyphicon glyphicon-th"></i>
                                </span>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-3 control-label">有效期结束</label>
                        <div class="col-md-6">
                            <div class="input-group date dolphin_date_picker" pickerPosition="bottom-left">
                                <input class="form-control" type="text" name="endDate" id="endDateInput">
                                <span class="input-group-addon">
                                    <i class="glyphicon glyphicon-th"></i>
                                </span>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-3 control-label">适用范围</label>
                        <div class="col-md-6">
                            <input class="form-control" name="couponRange" type="text" dol-validate="required">
                            <span></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-3 control-label">具体规则</label>
                        <div class="col-md-6">
                            <input class="form-control" name="couponRule" type="text" dol-validate="required">
                            <span></span>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary modelSave">确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>
<!--券模型的模态框 end-->
<!--生成券模态框 start-->
<div class="modal fade" id="generateModal" tabindex="-1" role="dialog" aria-labelledby="generateModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="generateModalLabel">生成券</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal generate-form">
                    <input type="hidden" class="form-control" name="id">
                    <div class="form-group">
                        <label class="col-md-3 control-label">券类型名称</label>
                        <div class="col-md-6">
                            <p class="form-control" name="name" id="showMsg"></p>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-3 control-label">券类型编码</label>
                        <div class="col-md-6">
                            <p class="form-control" name="code" ></p>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-3 control-label">券类型</label>
                        <div class="col-md-6">
                            <p class="form-control" options="couponType" name="couponType" ></p>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-3 control-label">数量</label>
                        <div class="col-md-6">
                            <input class="form-control" id="couponCnt" name="couponCnt" type="text" dol-validate="required">
                            <span></span>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary confirmBtn">确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>
<!--生成券模态框 end-->
<!--会员选择器 start-->
<div class="modal fade" id="userModal" tabindex="-1" role="dialog" aria-labelledby="userModalLabel">
    <div class="modal-dialog" role="document" style="left: 12%;top: 0;width: 80%;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                            aria-hidden="true">&times;</span></button>
                <span class="modal-title">会员选择器</span>
            </div>
            <div class="modal-body">
                <div class="queryCondition">
                    <form class="query-user-form">
                        <div class="row">
                            <div class="col-md-10">
                                <label>用户姓名：</label>
                                <input type="text" placeholder="支持模糊查询" name="name_like">
                                <label>联系方式：</label>
                                <input type="text" placeholder="支持模糊查询" name="phone_like">
                                <button class="btn btn-sm btn-inverse btn-query" id="queryUser" type="button">查询</button>
                            </div>

                        </div>
                    </form>
                </div>
                <div id="userList" class="box-content"></div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary confirmUser">确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>
<!--会员选择器 end-->
<% include ../common/footer.ejs %>
</body>
</html>
